<template>
  <div class="dash-bg">
    <el-alert v-if="isDemo" type="error" style="margin-bottom: 20px">
      为了保障演示系统的稳定性，重要演示数据无法修改和删除，您可以添加新的数据来体验！系统会不定时还原数据，请勿作为生产使用！
    </el-alert> <el-row :gutter="30">
      <el-col :span="18" :lg="19" :md="17" :sm="16">
        <card-stat-nums />
        <card-quick-opt @one="changeNotice" />
      </el-col>
      <el-col :span="6" :lg="5" :md="7" :sm="8">
        <card-notice-list :size="size" />
      </el-col>
      <el-col v-if="siteData.props.moduleExam" :span="12" class="module-exam" style="padding-top: 20px">
        <card-exam-list />
      </el-col>
      <el-col v-if="siteData.props.moduleExam" :span="12" class="module-exam" style="padding-top: 20px">
        <line-chart-exam id="chart3" title="考试统计" width="100%" height="300px" />
      </el-col>
      <el-col :span="24" style="padding-top: 20px">
        <line-chart-user id="chart1" title="用户总览" width="100%" height="300px" />
      </el-col>
    </el-row>
  </div>
</template>
<script>
import permission from '@/directive/permission'
import { mapGetters } from 'vuex'

export default {
  directives: { permission },
  data() {
    return {
      isDemo: this.$isDemo,
      size: 'normal'
    }
  },
  computed: {
    ...mapGetters([
      'siteData'
    ])
  },
  methods: {
    changeNotice() {
      this.size = 'small'
    }
  }
}
</script>
<style scoped>

</style>
